//交易页面
#jiaoyi {
    //侧边栏iocn
    aside {
        position: fixed;
        top: 4.6vw;
        left: 3vw;
        z-index: 999;
        i {
            position: fixed;
            font-size: @font18;
        }
        .icon-tongji {
            right: 10vw;
            top: 4.4vw;
            font-size: @font24;
        }
        .icon-icon-test,
        .icon-five-star {
            right: 3vw;
        }
    }
    .van-popup,
    .van-popup--left {
        padding: 5vw 0;
        background: @colorFFF;
        width: 80%;
        height: 100%;
        box-sizing: border-box;
    }
    .van-popup--right {
        height: 100%;
        box-sizing: border-box;
        width: 100%;
        background: @colorFFF;
        .contents {
            .contents(90%);
            .loginReightTitle();
            .return {
                .height(12vw);
            }
            .formWarp {
                input {
                    border: none;
                    padding: 0;
                    width: 60%;
                    border-bottom: 1px solid @up;
                    text-align: center;
                    margin: 0 auto;
                }
            }
            .btnWarp {
                .allBtn();
                margin-top: 60vw;
            }
        }
    }
    .topNav {
        padding: 4.5vw;
        border-bottom: 2.5vw solid @colord2d7db;
        .clearfix();
        .balance {
            float: left;
            h2 {
                font-weight: 700;
                color: @color1f3f59;
            }
            .tie {
                font-size: @font12;
                color: @colorc5cfd5;
            }
        }
        .prompt {
            padding-top: 2.5vw;
            float: right;
            font-size: @font12;
            color: @colorc5cfd5;
        }
    }
    .trading {
        padding: 2.5vh;
        border-bottom: 2.5vw solid @colord2d7db;
        overflow-x: hidden;
        .contNav {
            font-size: @font18;
            font-weight: 700;
            .buy,
            .sell {
                margin-right: 4.5vw;
                padding-bottom: 0.8vw;
            }
            .active {
                border-bottom: 2px solid @down;
            }
            .active2 {
                border-bottom: 2px solid @up;
            }
            .select {
                outline: none;
                border: none;
                font-size: @font18;
                font-weight: 700;
                color: @colord2d7db;
                background-color: #FFFFFF;
            }
        }
        .inputWarp {
            position: relative;
            padding-top: 3.8vw;
            .price,
            .num {
                margin-top: 2.8vw;
            }
            .van-slider {
                margin: 4.5vw 0;
            }
            .warpNum {
                position: absolute;
                top: 6.8vw;
                right: 0;
                border-left: 1px solid @line;
                .clearfix();
                .add,
                .del {
                    float: left;
                    text-align: center;
                    .height(13.2vw);
                    width: 15vw;
                    color: @color8fa1af;
                    font-size: @font24;
                    font-weight: 700;
                }
                .line {
                    float: left;
                    color: @line;
                    .height(13.5vw);
                }
            }
            .slider {
                padding-top: 5vw;
                position: relative;
                .canNum {
                    position: absolute;
                    font-size: @font12;
                    color: @colorc5cfd5;
                    bottom: -22px;
                    right: 0;
                }
                .weui-slider__inner {
                    height: 1vw;
                }
                .weui-slider__handler {
                    width: 20px;
                    height: 20px;
                    margin-top: -11px;
                }
            }
        }
        .priceAllWarp {
            margin-top: 12vw;
            h2 {
                color: @color8fa1af;
                font-size: @font14;
                font-weight: 700;
                .priceAll {
                    color: @color1f3f59;
                }
            }
        }
        .btn {
            margin-top: 5vw;
            width: 100%;
            .height(11.2vw);
            text-align: center;
            background: @down;
            color: #fff;
        }
    }
    .tradeOrder {
        .contents(90%);
        header {
            position: relative;
            font-size: @font18;
            color: @color1f3f59;
            font-weight: 700;
            .height(12.5vw);
            .goAllList {
                font-size: @font14;
                color: @color8fa1af;
                position: absolute;
                top: 0;
                right: 0;
                .van-icon {
                    position: relative;
                    top: 2px;
                    left: 2px;
                }
            }
        }
        .tradeOrderData {
            .noList {
                width: 100%;
            }
            .chengjiaoListWarp {
                .weituoList,
                .chengjiaoList {
                    padding: 2.5vw 0;
                    border-bottom: 1px solid @line;
                    font-size: @font14;
                    color: @color1f3f59;
                    font-weight: 700;
                    nav {
                        .clearfix();
                        .height(8vw);
                        .buyWarp {
                            float: left;
                            span {
                                margin-right: 2vw;
                            }
                        }
                        .cancellations {
                            float: right;
                        }
                    }
                    .weituoDataWarp,
                    .chengjiaoDataWarp {
                        .clearfix();
                        .weituoData,
                        .chengjiaoData {
                            float: left;
                            width: 32%;
                            text-align: center;
                            h2 {
                                line-height: 8vw;
                            }
                        }
                    }
                }
            }
        }
    }
    input {
        border: 1px solid @line;
        height: 13.5vw;
        padding-left: 3vw;
        box-sizing: border-box;
    }
    //滑块样式
}

//持仓界面
#cicangList {
    height: 100vh;
    background-color: @color141F31;
    #header {
        background-color: @color141F31;
        color: #FFFFFF;
        border-bottom: 2px solid @color091926;
    }
    .cicangWarp {
        .lisWarp {
            .clearfix();
            .list {
                padding: 3.8vw 0;
                font-size: @font16;
                font-weight: 700;
                color: #FFFFFF;
                float: left;
                width: 33%;
                text-align: center;
                border-bottom: 1.5vw solid @color091926;
                h2 {
                    line-height: 4.8vw;
                }
                span {
                    font-size: @font12;
                    color: #cdd3e9;
                }
            }
        }
    }
    .totleList {
        color: #FFFFFF;
        background-color: @color141F31;
        overflow-x: hidden;
        .van-tab {
            background-color: @color141F31;
        }
        .van-ellipsis {
            color: #FFFFFF;
            font-weight: 700;
            font-size: @font16;
        }
        .van-tabs__line {
            background-color: @up;
        }
        .van-tabs__content {
            .contents(90%);
            padding: 3vw 0;
        }
        .van-tab__pane {
            overflow-x: scroll;
        }
        .cicangWarp {
            width: 220%;
            .cicangNav {
                font-size: @font12;
                padding: 2vw 0;
                span {
                    text-align: center;
                    width: 17vw;
                    display: inline-block;
                }
                .twoPrice {
                    width: 35vw;
                }
                .pingcangBtn {
                    background-color: @up;
                    padding: 1vw 0;
                    border-radius: 0.8vw;
                }
                .buy {
                    color: @down;
                }
                .sell {
                    color: @up;
                }
            }
            .cicangList {
                border-bottom: 1px solid @color091926;
            }
        }
        .weituoListWarp,
        .chengjiaoListWarp {
            .weituoList,
            .chengjiaoList {
                padding: 2.5vw 0;
                border-bottom: 1px solid @color091926;
                font-size: @font14;
                nav {
                    .clearfix();
                    .height(8vw);
                    .buyWarp {
                        float: left;
                        span {
                            margin-right: 2vw;
                        }
                    }
                    .cancellations {
                        float: right;
                    }
                }
                .weituoDataWarp,
                .chengjiaoDataWarp {
                    .clearfix();
                    .weituoData,
                    .chengjiaoData {
                        float: left;
                        width: 32%;
                        text-align: center;
                        h2 {
                            line-height: 8vw;
                        }
                    }
                }
            }
        }
        .noList {
            position: fixed;
            left: 45%;
            top: 55%;
            font-size: @font12;
        }
    }
}